import variables from '@/styles/element-variables.scss'
import defaultSettings from '@/settings'
import { setLocal } from "@/utils/storage"

const { showSettings, tagsView, fixedHeader, sidebarLogo, supportPinyinSearch } = defaultSettings

const state = {
    theme: variables.theme,
    showSettings,
    tagsView,
    fixedHeader,
    sidebarLogo,
    supportPinyinSearch
}

const mutations = {
    CHANGE_SETTING: (state, { key, value }) => {
        // eslint-disable-next-line no-prototype-builtins
        if (state.hasOwnProperty(key)) {
            state[key] = value
            setLocal("settings",JSON.parse(JSON.stringify(state)))
        }
    },
    CHANGE_ALL_SETTING:(state,data) =>{
        Object.keys(data).forEach(key =>{
            state[key] = data[key]
        })
        
    }
}

const actions = {
    changeSetting ({ commit }, data) {
        commit('CHANGE_SETTING', data)
    },
    changeAllSetting ({ commit }, data) {
        commit('CHANGE_ALL_SETTING', data)
    }
}

export default {
    namespaced: true,
    state,
    mutations,
    actions
}

